<html>
<head>
<title>A Test</title>
</head>
<body>
<div id="calculatorContainer1">
    <div class="clear">
        <h2>calcWithHeaders</h2>
    </div>
    <table id="calcWithHeaders" border="1">
        <thead>
            <tr>
                <th>Header1</th>
                <th>Header2</th>
                <th>Header3</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>               
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>               
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>               
            </tr>
        </tbody>
    </table>
</div>

<div id="divWithTableWithAlertOnHeaderClick">
    <table id="tableWithAlertOnHeaderClick" border="1">
        <thead>
            <tr>
                <th onclick="alert('Header1');">Header1</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
            </tr>
        </tbody>
    </table>
</div>

<div id="calculatorContainer2">
    <div class="clear">
        <h2>calcWithOutHeaders</h2>
    </div>
    <table id="calcWithOutHeaders" border="1">
        <tbody>
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>               
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>               
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>               
            </tr>
        </tbody>
    </table>
</div>

<div id="calculatorContainer3">
    <div class="clear">
        <h2>calcWithHeaderCells</h2>
    </div>
    <table id='calcWithHeaderCells'>
        <tr>
            <th>header1</th>
            <td>0</td>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
            <th>header2</th>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
            <th>header3</th>
            <td>6</td>
            <td>7</td>
            <td>8</td>
        </tr>
    </table>
</div>
<br /><br />
<div id="parentdiv">
    <input type="password" name="pass" />
    <input type="TEXT" name="text1_test" />
    <p id="para1">This is a test paragraph to test the new CUITe_HtmlParagraph control!</p>
    <input type="button" value="sample button" />
</div>
<br /><br />
<div id="unorderedListTest">
    <ul id="unorderedList">
        <li>List Item 1</li>
        <li>List Item 2</li>
        <li>List Item 3</li>
    </ul>
</div>

</body>
</html>
